<template>
  <div>
    <son v-model="msg"></son>
    <input type="text" v-model="msg">

    <son2 v-model="msg"></son2>

    <div class="part part-3">
      <h3>son3:</h3>
      <son3 v-model="son3Obj"></son3>
    </div>
    <div class="part part-4">
      <h3>son4:</h3>
      <son4 v-model="son4Obj" @changeNameCB="doSome"></son4>
    </div>
  </div>
</template>

<script>
  import son from './son.vue'
  import son2 from './son2.vue'
  import son3 from './son3.vue'
  import son4 from './son4.vue'
  export default {
    name: "model",
    components: { son, son2, son3, son4 },
    data() {
      return {
        msg: '',
        son3Obj: {
          name: '初始名字'
        },
        son4Obj: {
          name: 'son4的初始名字'
        }
      }
    },
    watch: {
      'obj.name'(newval) {
        this.doSome(newval)
      }
    },
    methods: {
      doSome(val) {
        console.log(val);
      }
    }
  }
</script>

<style scoped>

</style>
